<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="HandheldFriendly" content="true" />
    <meta name="MobileOptimized" content="320" />
    <link rel="stylesheet" type="text/css" href="css/reset.css"/>
    <link rel="stylesheet" href="./css/jiazai.css">
    <link rel="stylesheet" type="text/css" href="css/animate.css"/>
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <style type="text/css">
		#com-tit{
			position: fixed;
			top: 0;
			right: 0;
			left: 0;
			z-index: 100;
			padding: 20px 20px 10px;
			background: #1e618a;
			color: white;
		}
		
		#com-tit>div:nth-of-type(1){
			flex: 0 0 80px;
			height: 30px;
			width: 100%;
		}
		.menu{
			width: 50px;
			height: 100%;
		}
		#com-tit>div:nth-of-type(2){
			flex: 1 1 0;
			font-size: 18px;
			text-align: center;
			color: white;
			width: 100%;
			
		}
		#com-tit>div:nth-of-type(3){
			flex: 0 0 80px;
			width: 100%;
			font-size: 14px;
			text-align: right;
		}
		#content-wrap{
			margin-top: 60px;
		}
		.ac-list{
			margin-top: 120px;
			padding: 0 20px;
		}
		.ac-info{
			padding: 20px 0;
			border-bottom: 1px solid #B5D1E2;
		}
		.ac-info>span{
			margin-left: 20px;
			font-size: 18px;
			color: #1D618A;
		}
		.ac-notice{
			margin: 80px 20px;
			padding: 20px;
			background-color: white;
		}
		.ac-notice>h3{
			font-size: 20px;
			color: #083762;
		}
		.ac-notice>p{
			padding-top: 10px;
			font-size: 15px;
			color: rgba(8, 55, 98, .8);
			line-height: 28px;
		}
    </style>
    <title>主页</title>
</head>

<body>
    <div id='app'>

        <!-- 加载中动画 -->
        <div id='jiazai-ani' v-if='jiazai'>
            <div class="arc"></div>
            <h1><span>LOADING</span></h1>
        </div>
        <!-- 加载中动画 -->
       
        <div id="com-tit" class='dis-spa'>
        	<div class='cont'>
        		<p class='menu dis-start' @tap="_close();">
	        		<img src="img/back-white.svg" style="width: 22px;height: 22px;" />
        		</p>
        	</div>
        	<div>激活程序</div>
        	<div class='cont' style="opacity: 0;">1</div>
        </div>
        
        <div id="content-wrap">
        	<div class="ac-list">
        		<div class="dis-start ac-info" @tap="goAc">
	        		<img src="img/jihuo.svg" style="width: 38px;height: 38px;"/>
        			<span v-if='avtivation'>已激活</span>
        			<span v-else>激活软件</span>
        		</div>
        		<div class="dis-start ac-info">
	        		<img src="img/customer-server.svg" style="width: 34px;height: 34px;"/>
        			<span style="margin-left:24px;" @tap="_findWe()">联系客服</span>
        		</div>
        	</div>
        	<div class="ac-notice">
        		<h3>温馨提示</h3>
        		<p>激活软件需要激活码，激活码需要联系客服去购买，每个激活码只能使用一次，并且必须在30分钟内激活，超过时间激活码无效，请注意时间！</p>
        	</div>
        </div>
    </div>
    <script src="js/comm.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/vue.min.js"></script>
    <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" charset="utf-8">
        var app = new Vue({
            el: '#app',
            data: {
                //加载动画
                jiazai: false,
                avtivation:String(JSON.parse(localStorage.getItem('ai_user')).avtivation)=='1'?true:false,
            },
            methods: {
            	//去已激活 / 输入信息激活程序
            	goAc:function(){
            		if(this.avtivation){
            			//已经激活了
            			_openHref({
	            			url:'activation-info.html',
	            			id:'activationInfo'
	            		});
            		}else{
            			//待激活
            			var op = {
					        'backButtonAutoControl': 'close', //返回是关闭当前页
					        'animationOptimization': 'none', //不优化
					        popGesture: 'close'
					    };
					    this.jiazai = true;
					    var This=this;
					    var web = plus.webview.create('already-activation.html', 'alreadyActivation', op);
					    web.addEventListener("loaded", function() {
					        setTimeout(function() {
					            This.jiazai = false;
					            web.show('slide-in-right');
					        }, 200);
					    }, false);
            		}
            	}
            }
        });
       
    </script>
</body>

</html>